<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <!--{include file='comm/header.tpl'}-->
    <title>新增报价单</title>
</head>

<body>

<div class="panel panel-default">

    <div class="comm_right">
        <div class="comm_crub">
            <span class="now_crub">报价单</span>
        </div>

        <div class="comm_content">

            <div class="panel-body">

                <div class="form-horizontal" style="position:relative">
                    <div class="form-group" >
                        <label class="col-sm-2 control-label">
                            客户信息：
                        </label>
                        <div class="col-sm-3">
                            <input type="hidden" id="costCode" value="<!--{$costInfo->costCode|default:''}-->">
                            <!--{if $companyInfo}-->
                            <input type="hidden" id="companyId" value="<!--{$companyInfo['company_id']|default:''}-->">
                            <input id="companyName" type="text" class="form-control" readonly="readonly" value="<!--{$companyInfo['company_name']|default:''}-->">
                            <!--{else}-->
                            <input type="hidden" id="companyId" value="<!--{$costInfo->companyId|default:''}-->">
                            <input id="companyName" type="text" class="form-control" readonly="readonly" value="<!--{$costInfo->company_name|default:''}-->">
                            <!--{/if}-->
                        </div>
                        <div class="col-sm-3">
                            <button type="button" class="btn btn-primary" onclick="searchCompany(1);">查询</button>
                        </div>
                    </div>
                    <div class="form-group" >
                        <label class="col-sm-2 control-label">
                            项目名称：
                        </label>
                        <div class="col-sm-3">
                            <input id="costName" class="form-control" value="<!--{$costInfo->costName|default:''}-->"/>
                        </div>
                        <label class="col-sm-2 control-label">
                            施工面积：
                        </label>
                        <div class="col-sm-3">
                            <input id="area" class="form-control" value="<!--{$costInfo->area|default:''}-->"/>
                        </div>
                    </div>
                    <div class="form-group" >
                        <label class="col-sm-2 control-label">
                            涂装体系：
                        </label>
                        <div class="col-sm-3">
                            <input id="categoryName" class="form-control" value="<!--{$costInfo->categoryName|default:''}-->"/>
                        </div>
                        <label class="col-sm-2 control-label">
                            物流方式：
                        </label>
                        <div class="col-sm-3">
                            <select class="form-control" id="expressId">
                                <option value="">请选择</option>
                                <!--{foreach from=$send_array item=send}-->
                                <!--{if $costInfo && $costInfo->expressId == $send['sendTypeID']}-->
                                <option value="<!--{$send['sendTypeID']}-->" selected><!--{$send['sendTypeName']}--></option>
                                <!--{else}-->
                                <option value="<!--{$send['sendTypeID']}-->"><!--{$send['sendTypeName']}--></option>
                                <!--{/if}-->
                                <!--{/foreach}-->
                            </select>
                        </div>
                    </div>
                    <div class="form-group">
                        <label class="col-sm-2 control-label">
                            备注：
                        </label>
                        <div class="col-sm-10">
                            <textarea id="remark" class="form-control w300" rows="3"><!--{$costInfo->remark|default:''}--></textarea>
                        </div>
                    </div>
                    <div style="text-align: right; margin-bottom: 5px">
                        <input class="btn btn-primary btn-sm" type="button" onclick="addGoods()" value="添加"/>
                    </div>
                    <table class="table table-bordered table-hover">
                        <thead>
                        <tr>
                            <th width="12%" style="text-align:center;">产品系列</th>
                            <th width="14%" style="text-align:center;">材料型号品名</th>
                            <th width="9%" style="text-align:center;">标准单价</th>
                            <th width="9%" style="text-align:center;">折扣率</th>
                            <th width="9%" style="text-align:center;">价格</th>
                            <th width="10%" style="text-align:center;">包装</th>
                            <th width="10%" style="text-align:center;">规格</th>
                            <th width="10%" style="text-align:center;">涂布率</th>
                            <th width="12%" style="text-align:center;">备注（颜色）</th>
                            <th width="5%" style="text-align:center;">操作</th>
                        </tr>
                        </thead>
                        <tbody id="goodsList">
                            <!--{if $costInfo}-->
                            <!--{foreach from=$costInfo->dtl item=goods}-->
                            <tr>
                                <td>
                                    <select class="form-control" name="category" disabled="disabled">
                                        <option value="<!--{$goods->bigCategoryID}-->"><!--{$goods->bigCategoryName}--></option>
                                    </select>
                                </td>
                                <td>
                                    <select class="form-control" name="goodsCode" disabled="disabled">
                                        <option value="<!--{$goods->goodsCode}-->"><!--{$goods->goodsName}--></option>
                                    </select>
                                </td>
                                <td style="text-align: center; line-height: 30px" name="salePrice">
                                    <!--{$goods->salePrice}-->
                                </td>
                                <td>
                                    <input class="form-control" name="discount" placeholder="0-100" value="<!--{$goods->discount}-->"/>
                                </td>
                                <td><input class="form-control" name="price" value="<!--{$goods->price}-->"/></td>
                                <td>
                                    <select class="form-control" name="packageId" disabled="disabled">
                                        <option value="<!--{$goods->packageId}-->"><!--{$goods->packageName}--></option>
                                    </select>
                                </td>
                                <td>
                                    <select class="form-control" name="specId" disabled="disabled">
                                        <option value="<!--{$goods->specId}-->"><!--{$goods->specName}--></option>
                                    </select>
                                </td>
                                <td>
                                    <input class="form-control" name="useRate" placeholder="KG/平米" value="<!--{$goods->useRate}-->"/>
                                </td>
                                <td><input class="form-control" name="remark" value="<!--{$goods->remark}-->"/></td>
                                <td style="text-align: center; line-height: 30px"><a>刪除</a></td>
                            </tr>
                            <!--{/foreach}-->
                            <!--{else}-->
                            <tr>
                                <td><select class="form-control" name="category"></select></td>
                                <td><select class="form-control" name="goodsCode"></select></td>
                                <td style="text-align: center; line-height: 30px" name="salePrice"></td>
                                <td><input class="form-control" name="discount" placeholder="0-100"/></td>
                                <td><input class="form-control" name="price"/></td>
                                <td><select class="form-control" name="packageId"></select></td>
                                <td><select class="form-control" name="specId"></select></td>
                                <td><input class="form-control" name="useRate" placeholder="KG/平米"/></td>
                                <td><input class="form-control" name="remark"/></td>
                                <td style="text-align: center; line-height: 30px"><a>刪除</a></td>
                            </tr>
                            <!--{/if}-->
                        </tbody>
                    </table>
                    <div style="font-size: 14px">
                        <span style="float: left">
                            报价有效期：<span name="validDate" ><!--{$validDate}--></span>
                        </span>
                        <span name="currDate" style="float: right">日期：<!--{$currDate}--></span>
                    </div>
                </div>

            </div>
        </div>
        <!--{if empty($costInfo) || $costInfo->costStatus ==0}-->
        <div class="bottom_fixbox" style="margin-left: 0px;width: 100%;left: 0px; height: 46px;">
            <div class="tac" style="background: #dddddd;">
                <input type="button" class="btn btn-primary" onclick="saveCost()" value="保存" />&nbsp;&nbsp;&nbsp;
                <input type="button" class="btn btn-default" onclick="E.closeWindows();" value="关闭" />
            </div>
        </div>
        <!--{/if}-->

    </div>

</div>

<script type="text/javascript">
    var categoryData = <!--{$category}-->;
    $(function () {
        <!--{if $costInfo && $costInfo->costStatus !=0}-->
        $('input,select,textarea,button,a').attr('disabled', 'disabled');
        $('#goodsList a').hide();
        <!--{/if}-->

        $('#goodsList').on('click','a', function () {
            if($('#goodsList tr').length==1){
                E.alert('至少包含一种材料');
                return;
            }
            $(this).parents('tr').remove();
        });

        //绑定分类
        $('#goodsList select[name=category]:not(:disabled)').each(function () {
            bindCategory($(this));
            bindGoods($(this));
        });

        //切换分类
        $('#goodsList').on('change','select[name=category]', function () {
            bindGoods($(this));
        });

        //选择商品
        $('#goodsList').on('change','select[name=goodsCode]', function () {
            if($(this).val() == '') return;
            var _tr = $(this).parents('tr');
            E.ajax_post({
                url: '/invokingAjax-backend/bill/billCost.ajax?operFlg=3',
                data: {
                    goodsCode: $(this).val()
                },
                call: function( o ) {
                    if(o.code == 200){
                        //包装、规格
                        var sHtml = '', bHtml = '',
                            syncArr = o.data.syncArr,
                            birthArr = o.data.birthArr;
                        $.each(syncArr, function (i, v) {
                            sHtml += '<option value="'+ i +'">'+ v +'</option>';
                        });
                        $.each(birthArr, function (i, v) {
                            bHtml += '<option value="'+ i +'">'+ v +'</option>';
                        })
                        _tr.find("select[name=packageId]").html(sHtml);
                        _tr.find("select[name=specId]").html(bHtml);
                        _tr.find("td[name=salePrice]").html(o.data.salePrice);
                        _tr.find("input[name=discount]").val('');
                    }
                }
            });
        });

        //计算金额
        $('#goodsList').on('blur','input[name=discount]', function () {
            if($(this).val() == '') return;
            if(!E.isNum($(this).val()) || $(this).val() > 100 || $(this).val() < 0){
                E.alert('请输入【0-100】之间的整数'); return;
            }
            var _tr = $(this).parents('tr'),
                price = _tr.find("input[name=price]"),
                salePrice = _tr.find("td[name=salePrice]").html();
            price.val(((salePrice*$(this).val())/100).toFixed(2));
        });

    });


    //绑定商品数据
    function bindGoods (obj, selectCode) {
        var goodsCode = obj.parents('tr').find('select[name=goodsCode]');
        var salePrice = obj.parents('tr').find('td[name=salePrice]');
        var packageId = obj.parents('tr').find('select[name=packageId]');
        var specId = obj.parents('tr').find('select[name=specId]');
        E.ajax_post({
            url: '/invokingAjax-backend/bill/billCost.ajax?operFlg=3',
            data: {
                categoryId: obj.val()
            },
            call: function( o ) {
                var html = '<option value="">请选择</option>';
                if(o.code == 200){
                    $.each(o.data, function (i, v) {
                        html += '<option value="'+ v.postID +'">'+ v.goodsName +'</option>';
                    })
                }
                goodsCode.html(html);
            }
        });
        salePrice.html('');
        packageId.html('<option value="">请选择</option>');
        specId.html('<option value="">请选择</option>');
    }

    //绑定分类数据
    function bindCategory (obj, selectId) {
        var html = ''; selectId = selectId || '';
        $.each(categoryData, function (i, v) {
            html += '<option value="'+ v.bigCategoryID +'" '+ (v.bigCategoryID==selectId?'selected':'') +'>'+ v.name +'</option>';
        });
        obj.append(html);
    }

    //添加商品行
    function addGoods () {
        var html = '', _tr = $('<tr></tr>');
        html += '   <td><select class="form-control" name="category"></select></td>';
        html += '   <td><select class="form-control" name="goodsCode"></select></td>';
        html += '   <td style="text-align: center; line-height: 30px" name="salePrice"></td>';
        html += '   <td><input class="form-control" name="discount" placeholder="0-100"/></td>';
        html += '   <td><input class="form-control" name="price"/></td>';
        html += '   <td><select class="form-control" name="packageId"></select></td>';
        html += '   <td><select class="form-control" name="specId"></select></td>';
        html += '   <td><input class="form-control" name="useRate" placeholder="KG/平米"/></td>';
        html += '   <td><input class="form-control" name="remark"/></td>';
        html += '   <td style="text-align: center; line-height: 30px"><a>刪除</a></td>';
        _tr.append(html);
        $('#goodsList').append(_tr);
        bindCategory(_tr.find('select[name=category]'));
        bindGoods(_tr.find('select[name=category]'));
    }

    //查询客户
    function searchCompany (page) {
        var company_name="";
        if($("#searchCompanyName").val()!=undefined){
            company_name = $("#searchCompanyName").val();
        }

        E.loadding.open('正在查询，请稍候...');

        E.ajax_post({
            url:  "/invokingAjax-backend/company/company.ajax?operFlg=1&company_name="+company_name,
            data: {
                sortname: 'company_id',
                sortorder: 'ASC',
                rp: 10,
                page: page,
                list_type: 'general',
                show_type: 'company',
                way_type:'searchCompany'
            },
            call: function( o ) {

                E.loadding.close();
                if (o.data) {

                    var html_str = '<table><tr><td style="width: 80px;">公司名称：</td><td><input type="text" class="form-control w300" id="searchCompanyName" name="searchCompanyName" value='+o.company_name+'></span></td><td><input type="button" value="查询" id="searchBtn" class="btn btn-primary" onclick="searchCompany(1);" /></td></tr></table>';
                    html_str += '<table class="s">';
                    html_str += '<tbody>';

                    html_str += '<tr>';
                    html_str += '<th width="80">操作</th>';
                    html_str += '<th width="*">公司名称</th>';
                    html_str += '<th width="100">联系人</th>';
                    html_str += '<th width="100">联系方式</th>';
                    html_str += '<th width="180">部门</th>';
                    html_str += '<th width="100">销售员</th>';

                    html_str += '</tr>';
                    $.each(o.data, function(k, v) {

                        if (v.mobile) {
                            var contact_way = v.mobile;
                        } else {
                            var contact_way = v.phone;
                        }

                        html_str += '<tr>';
                        html_str += '<td class="tac"><a href="javascript:void(0)" class="company_line" val0='+v.company_id+' val1='+v.company_name+' val2='+ v.connect_name+' val3='+ contact_way +' onclick="changeCompany('+v.company_id+');">选择</a></td>';
                        html_str += '<td class="tac" style="text-align:left">' + v.company_name + '</td>';
                        html_str += '<td class="tac">' + v.connect_name + '</td>';
                        html_str += '<td class="tac">' + contact_way + '</td>';
                        html_str += '<td class="tac">' + v.departmentName + '</td>';
                        html_str += '<td class="tac">' + v.userName + '</td>';
                        html_str += '</tr>';

                    });
                    html_str += '</tbody>';
                    html_str += '</table>';

                    if (o.paging) {
                        html_str += o.paging;
                    }

                    E.popup.open({
                        content: html_str,
                        title: '大客户信息列表',
                        css: 'width: 800px;'
                    });

                }else{
                    var html_str = '<table><tr><td style="width: 80px;">公司名称：</td><td><input type="text" class="form-control w300" id="searchCompanyName" name="searchCompanyName" value='+o.company_name+'></span></td><td><input type="button" value="查询" id="searchBtn" class="btn btn-primary" onclick="searchCompany(1);" /></td></tr></table>';
                    html_str += '<table class="s">';
                    html_str += '<tbody>';

                    html_str += '<tr>';
                    html_str += '<th width="80">操作</th>';
                    html_str += '<th width="*">公司名称</th>';
                    html_str += '<th width="100">联系人</th>';
                    html_str += '<th width="100">联系方式</th>';
                    html_str += '<th width="180">部门</th>';
                    html_str += '<th width="100">销售员</th>';

                    html_str += '</tr>';
                    html_str += '</tbody>';
                    html_str += '</table>';
                    E.popup.open({
                        content: html_str,
                        title: '大客户信息列表',
                        css: 'width: 800px;'
                    });
                }
            }
        });
    }

    //选择客户
    function changeCompany (searchCompanyID){
        E.ajax_post({
            url: '/invokingAjax-backend/company/company.ajax?operFlg=100&act=search',
            data: {
                company_id: searchCompanyID
            },
            call: function( o ) {
                if (o.code == 200) {
                    if ( o.data ) {
                        $.each( o.data, function( k, v ) {
                            $('#companyId').val(v.company_id);
                            $('#companyName').val(v.company_name);
                        });
                    }
                } else {
                    E.alert( o.message);
                }
                E.popup.close();
            }
        });
    }

    //保存数据
    function saveCost() {
        var costCode = $('#costCode').val(),
            companyId = $('#companyId').val(),
            companyName = $('#companyName').val(),
            costName = $('#costName').val(),
            area = $('#area').val(),
            categoryName = $('#categoryName').val(),
            expressId = $('#expressId').val(),
            remark = $('#remark').val();

        var error_msg = '';
        if (E.isEmpty(companyId))
            error_msg += '请选择客户<br/>';
        if (E.isEmpty(costName))
            error_msg += '请输入项目名称<br/>';
        if (E.isEmpty(area))
            error_msg += '请输入施工面积<br/>';
        if (E.isEmpty(categoryName))
            error_msg += '请输入涂装体系<br/>';
        if (E.isEmpty(expressId))
            error_msg += '请选择物流方式<br/>';

        var goodsData = [], goodsTr = $('#goodsList tr');
        if (goodsTr.length == 0) {
            error_msg += '请选择材料<br/>';
        } else {
            $.each(goodsTr, function (i, v) {
                var goodsCode = $(v).find('select[name=goodsCode]').val(),
                    goodsName = $(v).find('select[name=goodsCode]').find("option:selected").text(),
                    salePrice = $(v).find('td[name=salePrice]').html(),
                    discount = $(v).find('input[name=discount]').val(),
                    price = $(v).find('input[name=price]').val(),
                    packageId = $(v).find('select[name=packageId]').val(),
                    packageName = $(v).find('select[name=packageId]').find("option:selected").text(),
                    specId = $(v).find('select[name=specId]').val(),
                    specName = $(v).find('select[name=specId]').find("option:selected").text(),
                    useRate = $(v).find('input[name=useRate]').val(),
                    remark = $(v).find('input[name=remark]').val();
                if (E.isEmpty(goodsCode)) {
                    error_msg += '请选择您要添加的材料<br/>';
                } else if (E.isEmpty(discount) || E.isEmpty(price) || E.isEmpty(useRate)) {
                    error_msg += '请补全材料【' + goodsName + '】的数据<br/>';
                }
                goodsData.push({
                    goodsCode: goodsCode,
                    goodsName: goodsName,
                    salePrice: salePrice,
                    discount: discount,
                    price: price,
                    packageId: packageId,
                    packageName: packageName,
                    specId: specId,
                    specName: specName,
                    useRate: useRate,
                    remark: remark
                });
            });
        }

        if (error_msg != '') {
            E.alert(error_msg);
            return;
        }

        E.ajax_post({
            url: '/invokingAjax-backend/bill/billCost.ajax?operFlg=4',
            data: {
                costCode: costCode,
                companyId: companyId,
                companyName: companyName,
                costName: costName,
                area: area,
                categoryName: categoryName,
                expressId: expressId,
                remark: remark,
                validDate: $('span[name=validDate]').html(),
                dtl: goodsData
            },
            call: function (o) {
                if (o.code == 200) {
                    E.alert(o.message, 2, function () {
                        E.opener('cost.load');
                        E.closeWindows();
                    });
                } else {
                    E.alert(o.message)
                }
            }
        });
    }
</script>

</body>
</html>